import { Radio, RadioChangeEvent } from "antd";
import { useState } from "react";
import CommentList from "./components/CommentList";
import TimeLine from "./components/TimeLine";
import PhotoAlbum from "./components/PhotoAlbum";
import BasicInfo from "./components/BasicInfo";

export default function Love() {
  const [activeKey, setActiveKey] = useState("0");
  return (
    <div className="page__wrap--g">
    <div className="form__wrap--g">
      <Radio.Group
        size="middle"
        options={[
          { label: "基本信息", value: "0" },
          { label: "爱情相册", value: "1" },
          { label: "时间轴", value: "2" },
          { label: "留言板", value: "3" },
        ]}
        onChange={({ target: { value } }: RadioChangeEvent) => {
          setActiveKey(value);
        }}
        value={activeKey}
        optionType="button"
        buttonStyle="solid"
      />
    </div>
    <div className="table__wrap--g no-page">
      {{0:<BasicInfo/>,1:<PhotoAlbum/>,2:<TimeLine/>,3:<CommentList/>}[activeKey]}
    
    </div>
  </div>
  )
}
